html{
    font-size: 100%;
}

body{
padding: 0.5%;
font-family:Arial, Helvetica, sans-serif;
background: rgb(2,0,36);
background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 54%, rgba(255,169,111,1) 98%);
}

#container{
    width: 100%;
    border-radius: 10% 5% / 5% 5%;
    margin: 1%;
    padding: 5px;
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgb(7, 3, 82) 0%, rgb(24, 24, 121) 54%, rgb(255, 185, 138) 98%);
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
}


.item{
    border-radius: 45% 20% / 40% 20%;
    background: rgb(120,114,81);
    background: linear-gradient(0deg, rgba(120,114,81,1) 0%, rgba(14,0,179,1) 100%);
    padding: 1%;
    margin: 15px;
    width: 20vh;
    height: fit-content;
}
.image{
    max-width: 100%;
}
.price{
    margin-top: 8px;
    margin-bottom: 8px;
    font-weight:bold;

}
.name {
    font-weight: bold;
    font-size:large;
    font-stretch: condensed;
    inline-size: min-content;
    text-align: center;
    color: rgb(182, 121, 240);
    min-width: 100%;
    margin-left:5px;
    padding: 0px;
}

#input-letter{
    width: 15vw;
    height: 5vh;
    font-size: 130%;
}

#score-container{
    margin-top: 1%;
    margin-top: 1%;
    color:rgb(218, 131, 32);
    font-size:300%
}
.button-remove{
    border-radius: 40% 10% / 30% 20%;
    margin-bottom: 10px;
    background-color: darkorange;
}
.description{
    color:rgb(230, 213, 213);
    font-size:large;
    font-stretch: condensed;
    margin-bottom: 5%;
    display: none;
    max-width: 100%;
}

.more-info-link{
    
    font-size:70%;
    color:rgb(218, 131, 32)
}
.more-info{
    display: none;
}

.hide{
    border-radius: 45% 20% / 40% 20%;
    cursor: pointer;
    font-weight: bold;
    min-width: fit-content;
    margin-left: 20%;
    margin-right: 20%;
    margin-bottom: 5%;
    text-align: center;

    
    background-color: rgb(117, 102, 93);
    height: 50%;
}